<template>
    <div>
        <van-notice-bar left-icon="volume-o" text="音乐是人生中不可或缺的一部分，让我们在心灵深处找到安慰。" />

    </div>
    <div>
        <van-swipe :autoplay="3000" lazy-render>
      <van-swipe-item v-for="image in images" :key="image">
        <img :src="image" width="100%" height="200px" />
      </van-swipe-item>
    </van-swipe>
    </div>
    <div>
        <van-notice-bar left-icon="volume-o" :scrollable="false">
            <van-swipe vertical class="notice-swipe" :autoplay="3000" :touchable="false" :show-indicators="false">
                <van-swipe-item>让每一刻永恒，记录你的不凡之旅</van-swipe-item>
                <van-swipe-item>让梦想照进现实，从现在开始</van-swipe-item>
                <van-swipe-item>一段动人心魄的旋律，一个独具特色的音符</van-swipe-item>
            </van-swipe>
        </van-notice-bar>
    </div>
    <div>
        <video src="https://fd.aigei.com/src/vdo/mp4/86/8626a96ea63644c1bd8a76e6e7c00d45.mp4?e=1720910940&token=P7S2Xpzfz11vAkASLTkfHN7Fw-oOZBecqeJaxypL:exVtY3my1FAMcEuLlHk5BHvVXJE=" autoplay muted loop class="bg"></video>
    </div>
    <div>
        <video src="https://fd.aigei.com/src/vdo/mp4/0b/0bd335bb9bf645e2ae5ae15ce54fb6cc.mp4?e=1720910940&token=P7S2Xpzfz11vAkASLTkfHN7Fw-oOZBecqeJaxypL:fEVxmSUm_iGVvCpTGBRJiHPU1zo=" class="bg"></video>
    </div>

</template>
<script setup>
import { ref } from 'vue'

const images = [
  'https://img1.baidu.com/it/u=3591334379,2269740309&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500',
  'https://img1.baidu.com/it/u=2060956542,271303720&fm=253&fmt=auto&app=120&f=JPEG?w=889&h=500',
  'https://img2.baidu.com/it/u=2399773741,3146247898&fm=253&fmt=auto&app=138&f=JPEG?w=749&h=500'
];

</script>
<style scoped>
.notice-swipe {
    height: 40px;
    line-height: 40px;
}
.bg{
    margin-left: 25px;
    margin-top: 10px;
}
</style>